import React, { FC } from 'react';
import cn, { Argument } from 'classnames';

if (process.env.BROWSER) {
    require('../static/styles/card.scss');
}

const COM_PREKEY = 'Card';

interface CardProps {
    /**
     * background color or image
     */
    background?: string;

    radius?: number;

    isShadowed?: boolean;

    specClassName?: Argument | Argument[];
}

const Card: FC<CardProps> = (props) => {
    return (
        <div
            className={cn('card', { 'is-shadowed': props.isShadowed }, props.specClassName)}
            style={{ background: props.background }}
        >
            {props.children}
        </div>
    );
};

Card.displayName = 'Card';

export { Card, CardProps };
